<!--
 * @Author: coocase
 * @Date: 2021-03-10 14:16:41
 * @LastEditTime: 2021-06-11 12:17:26
 * @LastEditors: coocase
 * @Description: 主页
 * @FilePath: \git\dami\src\pages\index\index.vue
-->
<template>
  <div>

      <Layout class="index-wrap">


            <div class="wrap">

                <banner ></banner>
            </div>
            <Content class="index-content wrap">
                <tab></tab>
<!--                <floor></floor>       -->
            </Content>



      </Layout>


  </div>
</template>

<script>



import Banner from './banner'
import Floor from './floor.vue'
import Tab from './tabs'//和iview组件Tabs重名 使用会造成这里和组件内的Tabs反复调用 溢出堆栈


export default {
    name: "Index",
    components: {

        Banner,
        Floor,
        Tab
    },
    methods:{
        getUrl(){
            //通过解析url获取用户名
        var url = window.location.href; /* 获取完整URL */
          var pattern = /[^/]+$/;
          var userName = pattern.exec(url)

        //先判断再复制
        if(userName){
            this.GLOBAL.userName = userName;
            this.GLOBAL.hasLogin = true;
            // vm.$emit( eventName, […args] )
            //  参数：
            //  {string} eventName
            //  [...args]
            //触发当前实例上的事件。附加参数都会传给监听器回调。
            //如果正则匹配到用户名不为空则 触发父组件方法，userName作为参数传递给父组件app.vue
            this.$emit('indexName', userName.toString())
        }
        }
    },

    mounted(){

          this.getUrl();
        // test mockjs
        // this.$http.postRequest({
        //     api: 'testPost',
        //     data: {
        //         type:"post",
        //         data: {
        //             username: "zs",
        //             age: 18
        //         }
        //     }
        // }).then((res) => {
        //     console.log("post");

        // }).catch((err) => {
        //         console.log(err)
        // });

        //  this.$http.getRequest({
        //     api: 'testGet',
        //     data: {
        //         type:"get",
        //         data: {
        //             id: 15,
        //             name:'sdf'
        //         }
        //     }
        // }).then((res) => {
        //     console.log(res);

        // }).catch((err) => {
        //         console.log(err)
        // });

    },
    updated: function () {
        // console.log('update')

    }
}
</script>

<style scoped>
.index-wrap{
    background-color: #FFF;

}
.wrap{
    width: 1200px;
    align-self: center;
}
.index-content{
    margin-top:430px ;
    /* height: 350px; */
    /* 这里误设置了高度导致floor溢出，没有撑起应有的高度 footer布局在了tab后*/
}



</style>
